.columnSelectorWrapper {
    position: relative;
    margin: 10px 0;
    display: inline-block;
}

.columnSelector,
.hidden {
    display: none;
}

.columnSelectorButton {
    background: #99bfe6;
    border: #888 1px solid;
    color: #111;
    border-radius: 5px;
    padding: 5px;
}

#colSelect1:checked + label {
    background: #5797d7;
    border-color: #555;
}

#colSelect1:checked ~ #columnSelector {
    display: block;
}

.columnSelector {
    width: 120px;
    position: absolute;
    top: 30px;
    padding: 10px;
    background: #fff;
    border: #99bfe6 1px solid;
    border-radius: 5px;
}

.columnSelector label {
    display: block;
}

.columnSelector label:nth-child(1) {
    border-bottom: #99bfe6 solid 1px;
    margin-bottom: 5px;
}

.columnSelector input {
    margin-right: 5px;
}

.columnSelector .disabled {
    color: #ddd;
}


/*** Bootstrap popover ***/

#popover-target label {
    margin: 0 5px;
    display: block;
}

#popover-target input {
    margin-right: 5px;
}

#popover-target .disabled {
    color: #ddd;
}

.side-bar {
    position: fixed;
    z-index: 20;
    right: -240px;
    top: 0;
    width: 240px;
    height: 300px;
    background-color: #fff;
    transition: all 200ms ease-out;
    @at-root #{&}-open {
        right: 0;
    }
}

.boutton-menu {
    margin-top: 20px;
    .navbar-nav {
        .menu-dropdown {
            position: relative;
            float: none;
            background-color: #337ab7;
            a {
                padding-top: 15px;
                padding-bottom: 15px;
                color: #fff;
            }
            &:hover {
                & a {
                    color: #fff;
                    background-color: #188AE2;
                }
                & > .dropdown-menu {
                    position: absolute;
                    left: 100%;
                    top: 0;
                    display: block;
                }
            }
        }
    }
}
